<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <button id="restartButton">重新开始</button></div></br>
    <span>请输入要猜的数字：</span>
    <input type="text" id="guessInput">
    <button id="guessButton">猜</button></br>
    <span>已经猜的次数：</span><span id="guessCount">0</span></br>
    <span >猜的结果:</span><span id="result"></span>
    <script src="https://code.jquery.com/jquery-3.7.1.min.js"></script>

    <script>
        let randomNuber=Math.floor(Math.random()*100)+1;
        console.log(randomNuber);
        $("#guessButton").click(function(){
                let count=$("#guessCount").text();
                count++;
                $("#guessCount").text(count);
             let ret=$("#guessInput");
             if(ret.val()>randomNuber){
                $("#result").text("你猜的数字大了");
                $("#result").css("color","red");
             }else if(ret.val()<randomNuber){
                $("#result").text("你猜的数字小了");
                $("#result").css("color","red");
             }else{
                $("#result").text("恭喜你，猜对了！");
                $("#result").css("color","green");
             }
        })
        $("#restartButton").click(function(){
        let randomNuber=Math.floor(Math.random()*100)+1;
        console.log(randomNuber);
        $("#guessCount").text(0);
        $("#result").text("");
        $("#guessInput").val("");
        })
    </script>
</body>
</html>